<template>
	<div class="my_main">
		<div class="my_header">
			<mu-appbar :title="appName" titleClass="titleClass">
			    <mu-icon-menu icon="more_vert" slot="right">
			    	<!-- <mu-menu-item leftIcon="books" title="资料修改" @click="navClick('todayTask')"/>
			    	<mu-menu-item leftIcon="settings" title="系统设置" @click="navClick('template')"/> -->
			    	<mu-menu-item leftIcon="power_settings_new" title="退出登录" @click="navClick('logout')"/>
			    </mu-icon-menu>
			</mu-appbar>
		</div>
		<div class="my_body">
			<transition>
		        <router-view/>
		    </transition>
		</div>
		<div class="my_footer">
			<mu-paper>
			  <mu-bottom-nav :value="bottomNav" @change="masterNav">
				    <mu-bottom-nav-item value="task" title="待办事项" icon="favorite"/>
			    	<!-- <mu-bottom-nav-item href="#/desire" value="desire" title="许愿池" icon="location_on"/> -->
				    <mu-bottom-nav-item value="system" title="设置" icon="dvr"/>
				    <mu-bottom-nav-item value="member" title="我的" icon="person_pin"/>
			  </mu-bottom-nav>
			</mu-paper>
		</div>

		<!-- alertDialog -->
		<alerts-dialog :alertData="alertDialog"></alerts-dialog>
	</div>
</template>

<script>
import axios from 'axios'
import { mapState } from 'vuex'
export default{
	data(){
		return {
			alertDialog: {},
			inviteDialog: false
		}
	},
	methods: {
		masterNav (val) {
	    	this.$store.commit('setBottomNav', val)

	    	switch(val){
	    		case 'task':
	    			this.$router.push('/index');
	    			break;
	    		case 'system':
	    			this.$router.push('/system/addTask');
	    			break;
	    		case 'member':
	    			this.$router.push('/member');
	    			break;
	    		default: break;
	    	}
	    },
	    //右上角导航点击事件
	    navClick(title){
	    	let me = this;
			switch(title){
				case 'logout':
					this.alertDialog = {
						openState: true,
						content: '注销成功！将返回登录页...'
					}
					this.$store.state.userInfo = {};
					localStorage.mobile = '';
					setTimeout(function(){
						me.$router.push('/login');
					}, 1000)
					break;
				default: break;
			}
		},
		//获取所有成员列表
		getUserList(teamId){
			axios.post($base + 'users/userList', {
				teamId: teamId
			}).then(json => {
				this.$store.state.userList = json.data;
			}).catch(json => {
				console.log(json)
			})
		},
	},
	computed: mapState(['appName', 'bottomNav']),
	mounted(){
		//无帐号返回登录
		if(!localStorage.mobile){
			this.$router.push('/login')
		}else{
			//获取用户信息
			axios.post($base + 'users/userInfo', {
				mobile: localStorage.mobile
			}).then(json => {
				this.$store.state.userInfo = json.data;
				this.$store.state.appName = json.data.teamName;

				//验证团队信息
				let teamId = this.$store.state.userInfo.teamId;
				if(!teamId){
					this.$store.state.userList = [];
				}else if(teamId == '100'){
					
				}else{
					this.getUserList(teamId);
				}
			}).catch(json => {
				console.log(json)
			})
		}
	}
}
</script>